<style type="text/css">
    .opsi{
        display: block;
        clear: both;
        padding: 30px 0;
    }

    #botket{
        position: fixed;
        bottom: 0;
        right: 200px;
        text-align: right;
    }
    #defaultCountdown { 
        position: fixed;
        right: 200px;
        float: right;
        width: 240px; 
        height: 45px;
    }
</style>
<div class="container">
    <script type="text/javascript" src="<?php echo base_url('js/jquery.countdown.min.js'); ?>"></script>
    <script type="text/javascript">
        $(function () {
            currSec = <?php echo $waktu->waktu; ?>;
            $('#defaultCountdown').countdown({until: +currSec, onExpiry: telas});
            if (currSec < 0){
                telas();
            }
        });
    </script>
    <div class="row">
        <div id="defaultCountdown"></div>
        <?php
        if(isset($jawab->id)){
            echo form_hidden('id_jawab', $jawab->id);
        }
        echo form_hidden('id', $row->id);
        echo form_hidden('id_soal', $row->id_soal);
        ?>    
        <fieldset>
            <?php
            if ($this->uri->segment(4)) {
                $no_soal = $this->uri->segment(4) + 1;
            } else {
                $no_soal = 1;
            }
            ?>
            <legend>Soal <?php echo $no_soal . "/" . $jumops->jumlah_soal; ?></legend>
            <p><?php echo $row->soal; ?></p>

            <!--            if ada gambar-->
            <?php if ($row->gambarsoal != null) { ?>
                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarsoal; ?>" alt="" class="span3"/>
            <?php } ?>
            <hr />
            <div id="botket">
                <button class="jawab hentikan pagination btn btn-warning">Hentikan</button>
            <?php
            echo $this->pagination->create_links();
            ?>
            </div>


            <!--            foreach banyak soal-->
            <?php
            switch ($jumops->jumlah_opsi) {
                case 3:
                    ?>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios1" value="1" <?php
            if (isset($jawab->jawaban)) {
                if ($jawab->jawaban == 1) {
                    echo 'checked';
                }
            }
                    ?>>
                            <?php echo $row->opsia; ?>
                            <br />
                            <?php if ($row->gambara != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambara; ?>" alt="" class="span3"/>
        <?php } ?>
                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios2" value="2" <?php
        if (isset($jawab->jawaban)) {
            if ($jawab->jawaban == 2) {
                echo 'checked';
            }
        }
        ?>>
                            <?php echo $row->opsib; ?>
                            <br />
        <?php if ($row->gambarb != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarb; ?>" alt="" class="span3"/>
        <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios3" value="3" <?php
        if (isset($jawab->jawaban)) {
            if ($jawab->jawaban == 3) {
                echo 'checked';
            }
        }
        ?>>
        <?php echo $row->opsic; ?>
                            <br />
                    <?php if ($row->gambarc != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarc; ?>" alt="" class="span3"/>
                    <?php } ?>

                        </label>
                    </div>
                            <?php
                            break;
                        case 4:
                            ?>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios1" value="1" <?php
                    if (isset($jawab->jawaban)) {
                        if ($jawab->jawaban == 1) {
                            echo 'checked';
                        }
                    }
                    ?>>
        <?php echo $row->opsia; ?>
                            <br />
                            <?php if ($row->gambara != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambara; ?>" alt="" class="span3"/>
                            <?php } ?>
                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios2" value="2" <?php
                    if (isset($jawab->jawaban)) {
                        if ($jawab->jawaban == 2) {
                            echo 'checked';
                        }
                    }
                    ?>>
                            <?php echo $row->opsib; ?>
                            <br />
                            <?php if ($row->gambarb != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarb; ?>" alt="" class="span3"/>
                                   <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios3" value="3" <?php
                           if (isset($jawab->jawaban)) {
                               if ($jawab->jawaban == 3) {
                                   echo 'checked';
                               }
                           }
                           ?>>
                            <?php echo $row->opsic; ?>
                            <br />
                                   <?php if ($row->gambarc != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarc; ?>" alt="" class="span3"/>
                            <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios4" value="4" <?php
                            if (isset($jawab->jawaban)) {
                                if ($jawab->jawaban == 4) {
                                    echo 'checked';
                                }
                            }
                            ?>>
                            <?php echo $row->opsid; ?>
                            <br />
                            <?php if ($row->gambard != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambard; ?>" alt="" class="span3"/>
                                   <?php } ?>

                        </label>
                    </div>
                            <?php
                            break;
                        case 5:
                            ?>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios1" value="1" <?php
                            if (isset($jawab->jawaban)) {
                                if ($jawab->jawaban == 1) {
                                    echo 'checked';
                                }
                            }
                            ?>>
                            <?php echo $row->opsia; ?>
                            <br />
                            <?php if ($row->gambara != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambara; ?>" alt="" class="span3"/>
        <?php } ?>
                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios2" value="2" <?php
        if (isset($jawab->jawaban)) {
            if ($jawab->jawaban == 2) {
                echo 'checked';
            }
        }
        ?>>
                            <?php echo $row->opsib; ?>
                            <br />
        <?php if ($row->gambarb != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarb; ?>" alt="" class="span3"/>
        <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios3" value="3" <?php
        if (isset($jawab->jawaban)) {
            if ($jawab->jawaban == 3) {
                echo 'checked';
            }
        }
        ?>>
        <?php echo $row->opsic; ?>
                            <br />
        <?php if ($row->gambarc != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambarc; ?>" alt="" class="span3"/>
        <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios4" value="4" <?php
        if (isset($jawab->jawaban)) {
            if ($jawab->jawaban == 4) {
                echo 'checked';
            }
        }
        ?>>
                    <?php echo $row->opsid; ?>
                            <br />
                    <?php if ($row->gambard != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambard; ?>" alt="" class="span3"/>
                    <?php } ?>

                        </label>
                    </div>
                    <div class="opsi">
                        <label class="radio">
                            <input type="radio" name="optionsRadios" id="optionsRadios5" value="5" <?php
            if (isset($jawab->jawaban)) {
                if ($jawab->jawaban == 5) {
                    echo 'checked';
                }
            }
            ?>>
        <?php echo $row->opsie; ?>
                            <br />
        <?php if ($row->gambare != null) { ?>
                                <img src="<?php echo site_url(); ?>/gambarsoal/<?php echo $row->gambare; ?>" alt="" class="span3"/>
        <?php } ?>

                        </label>
                    </div>
        <?php
        break;
}
?>
        </fieldset>
<?php ?>   
        <br>
    </div>
</div>
<script type="text/javascript">
    
    function telas(){
        var form_data = {
            id_soal : $('input:hidden[name=id_soal]').val(),           
            ajax : '1'
        };
        $.ajax({
            url: "<?php echo site_url('siswa/hentikan'); ?>",
            type: 'POST',
            async : false,
            data: form_data,
            success:function(){
                alert('telas heb');
                window.location.replace("<?php echo site_url('siswa/nilai'); ?>");
            }
        });
        return false;
    }

    $('.jawab').click(function() {
        var form_data = {
            id_jawab : $('input:hidden[name=id_jawab]').val(),
            id_siswa : "<?php echo $this->session->userdata('id'); ?>",
            id_det_soal : $('input:hidden[name=id]').val(),
            id_soal : $('input:hidden[name=id_soal]').val(),
            jawaban : $('input:radio[name=optionsRadios]:checked').val(),
            ajax : '1'
        };
        $.ajax({
            url: "<?php echo site_url('siswa/jawab'); ?>",
            type: 'POST',
            async : true,
            data: form_data
        });
        return true;
    });
    
    $('.hentikan').click(function() {
        var form_data = {
            id_soal : $('input:hidden[name=id_soal]').val(),           
            ajax : '1'
        };
        $.ajax({
            url: "<?php echo site_url('siswa/hentikan'); ?>",
            type: 'POST',
            async : false,
            data: form_data,
            success:function(){
                window.location.replace("<?php echo site_url('siswa/nilai'); ?>");
            }
        });
        return false;
    });
</script>